<template>
    <!-- 页面全局配置 -->
    <view class="pageconfig">
        <!--vuetop-->
        <view class="flex1   response  flex  justify-center  " style="flex-direction: column;align-content: center;align-items: center;">
            <view class="flex2  bg-white   flex  justify-center  " style="flex-direction: column;align-content: center;align-items: center;"    v-for="i in 6" >
                <view class="flex3   response  flex  justify-between  " style="flex-direction: row;align-content: center;align-items: center;">
                    <view class="flex4    flex  justify-around  " style="flex-direction: row;align-items: center;">
                        <image style="width:100rpx;height:100rpx;min-height:unset;" mode="" class="picture5 round " :src="picsrc5"></image>
                        <text> ywewws</text>
                    </view>
                    <view class="flex7    flex  justify-end  " style="flex-direction: row;">
                        <text> 2024-08-22 12:12:12</text>
                    </view>
                </view>
                <view class="flex9   response  flex  justify-start  " style="flex-direction: column;">
                    <text class="text10 "> to:widwiw</text>
                    <view class="flex11    flex flex-wrap justify-start  ">
                        <text class="text12 response "> 我还是想和你当朋友的我还是想和你当朋友的我还是想和你当朋友的我还是想和你当朋友的666666</text>
                    </view>
                </view>
            </view>
        </view>

        <!--vuebottom-->
    </view>
</template>

<script>
    import Vue from 'vue'
    export default {
        data() {
            return {
                picsrc5: "/static/liuyan/touxiang.png",
            };
        },
        onLoad() {


        },
        methods: {


            /**
             *          $vuetag = "";
             *          $vuecss = "";
             *          $vuejs = "";
             *
             */

            //获取数据

        }
    }
</script>

<style lang="less">
    /**
 *
 此处必须引用colorui样式,并放入根目录，css样式可以这样写
	@import "colorui/main.css";
	@import "colorui/icon.css";

 如需要引用colorui到全局，
 需要在App.vue 引入
 	@import "colorui/main.css";
	@import "colorui/icon.css";
 *
 */




    /**本页全局配置的代码**/
    .pageconfig {
        width: 100%;
        overflow: hidden;
        overflow-y: scroll;
        background-color: rgba(247, 252, 253, 1);
        height: 100vh;
    }



    /**pagedomcss**/


    .flex1 {
        width: 100%;
    }

    .flex2 {
        width: 95%;
        width: calc(95% - 40rpx);
        margin-top: 20rpx;
        margin-bottom: 20rpx;
        margin-left: 20rpx;
        margin-right: 20rpx;
        padding-top: 20rpx;
        padding-bottom: 20rpx;
        padding-left: 20rpx;
        padding-right: 20rpx;
        border-top-left-radius: 40rpx;
        border-top-right-radius: 40rpx;
        border-bottom-right-radius: 40rpx;
        border-bottom-left-radius: 40rpx;
    }

    .flex3 {
        width: 100%;
    }

    .flex4 {
        width: 40%;
    }

    .picture5 {
        width: 100rpx;
        overflow: hidden;
        height: 100rpx;
    }

    .flex7 {
        width: 56%;
    }

    .flex9 {
        width: 100%;
    }

    .text10 {
        margin-top: 20rpx;
        margin-bottom: 20rpx;
        margin-left: 10rpx;
    }

    .flex11 {
        width: 89%;
        margin-left: 40rpx;
    }

    .text12 {
        width: 100%;
    }
</style>